<template>
  <div>
  <div class="box1" v-for="(itms,index) in arr" :key="index"> <img1 :sr="itms" @change="btn"></img1></div>
  <p>点击的猫为:{{da}}</p>
  </div>
</template>

<script>
  import img1 from './10.1子组件.vue'
export default {
  methods:{
    btn(a){
      this.da +=       a 
    }
  },
  data(){
    return{
     arr:[
      {im:'https://ts1.cn.mm.bing.net/th/id/R-C.970f5542d5ddb5378a08752e77731282?rik=xrIYQ2E0xWhj7Q&riu=http%3a%2f%2fwww.kutoo8.com%2fupload%2fimage%2f16873634%2f2016030305.jpg&ehk=gk%2bVJIrVcoDBJ6cCZlbvd4UYTR6Zg1v1gUN5mZ0c%2bjI%3d&risl=&pid=ImgRaw&r=0',title:'小猫'},
      {im:'https://ts1.cn.mm.bing.net/th/id/R-C.b300fb50698096cbf9153b8535458d6e?rik=jfepCvy0NXWi8Q&riu=http%3a%2f%2fwww.kutoo8.com%2fupload%2fimage%2f16853548%2f2015010802_1680x1050.jpg&ehk=pIrqfZZ%2bVHdSMrXwLSgQ6nS9t9yn3jLeTfcPBOX52FE%3d&risl=&pid=ImgRaw&r=0',title:'睡觉猫'},
      {im:'https://desk-fd.zol-img.com.cn/t_s960x600c5/g5/M00/0D/01/ChMkJl3bL7yIBuTFAAaVf3SWB9gAAvZvQDoCKMABpWX398.jpg',title:'蓝猫'},
      {im:'https://ts1.cn.mm.bing.net/th/id/R-C.970f5542d5ddb5378a08752e77731282?rik=xrIYQ2E0xWhj7Q&riu=http%3a%2f%2fwww.kutoo8.com%2fupload%2fimage%2f16873634%2f2016030305.jpg&ehk=gk%2bVJIrVcoDBJ6cCZlbvd4UYTR6Zg1v1gUN5mZ0c%2bjI%3d&risl=&pid=ImgRaw&r=0',title:'第二个小猫'},
      {im:'https://ts1.cn.mm.bing.net/th/id/R-C.b300fb50698096cbf9153b8535458d6e?rik=jfepCvy0NXWi8Q&riu=http%3a%2f%2fwww.kutoo8.com%2fupload%2fimage%2f16853548%2f2015010802_1680x1050.jpg&ehk=pIrqfZZ%2bVHdSMrXwLSgQ6nS9t9yn3jLeTfcPBOX52FE%3d&risl=&pid=ImgRaw&r=0',title:'第二个睡觉猫'},
      {im:'https://desk-fd.zol-img.com.cn/t_s960x600c5/g5/M00/0D/01/ChMkJl3bL7yIBuTFAAaVf3SWB9gAAvZvQDoCKMABpWX398.jpg',title:'第二个蓝猫'},
     ],
     da:''
    }
  },
components:{
  img1
  
}
}
</script>

<style>
.box1{
  display: inline-block;
}
</style>